import 'dart:async';

import 'package:chathouse/public/Config.dart';
import 'package:chathouse/util/base_utils.dart';
import 'package:flutter/material.dart';

import '../../../public/event_bus.dart';
import '../../../widgets/base_appbar.dart';
import '../../../widgets/buttons_tabbar.dart';
import 'client_msg_list.dart';
import 'client_service_list.dart';

class ClientMessageListPage extends StatefulWidget {
  const ClientMessageListPage({Key? key}) : super(key: key);

  @override
  _MessageListPageState createState() => _MessageListPageState();
}

class _MessageListPageState extends State<ClientMessageListPage>
    with AutomaticKeepAliveClientMixin, SingleTickerProviderStateMixin {

  @override
  bool get wantKeepAlive => true;

  late TabController tabController;
  StreamSubscription? refreshSubscription;

  @override
  void initState() {
    super.initState();
    tabController = TabController(length: 2, vsync: this);
    refreshSubscription =
        eventBus.on<UpdateClientMessageEvent>().listen((event) {
      if (!mounted) return;
      tabController.animateTo(event.idx as int);
    });
  }

  @override
  void dispose() {
    tabController.dispose();
    refreshSubscription?.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: getAppBar(leading: Container(), title: "訊息"),
      body: Column(
        children: <Widget>[
          ButtonsTabBar(
            controller: tabController,
            duration: 0,
            height: 45.w,
            labelStyle: getTextStyle(16.sp,
                color: MyColors.red_2166474, fontType: FontType.BOLD),
            unselectedLabelStyle: getTextStyle(16.sp,
                color: Colors.black, fontType: FontType.BOLD),
            buttonMargin: EdgeInsets.only(bottom: 0, top: 12.w, left: 8.w),
            contentPadding: EdgeInsets.symmetric(horizontal: 54.w),
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(14.w),
                    topRight: Radius.circular(14.w))),
            unselectedDecoration: BoxDecoration(
                color: MyColors.gary_210210210,
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(14.w),
                    topRight: Radius.circular(14.w))),
            tabs: const [
              Tab(
                text: "對話",
              ),
              Tab(
                text: "服務及優惠",
              ),
            ],
          ).setContainer(
              width: double.infinity,
              color: MyColors.gary_232233237,
              alignment: Alignment.center,
              padding: EdgeInsets.only(left: 20.w, right: 20.w)),
          Expanded(
            child: TabBarView(
              controller: tabController,
              children: const <Widget>[
                ClientMsgList(),
                ServiceDiscountList(),
              ],
            ).setContainer(
                margin: EdgeInsets.only(left: 16, right: 16, top: 6.w)),
          ),
        ],
      ),
    );
  }
}
